<template>
  <el-form ref="form" :model="form" label-width="80px">
    <el-form-item >
      <span class="tag-group__title">商品名称</span>
      <el-tag
        effect="dark">
        {{ form.goodsName }}
      </el-tag>
    </el-form-item>
    <el-form-item>
      <el-image
        style="width: 100px; height: 100px"
        :src="form.img">
      </el-image>
    </el-form-item>
    <el-form-item >
      <span class="tag-group__title">商品价格</span>
      <el-tag
        type= danger
        effect="dark">
        {{ form.price }}
      </el-tag>
    </el-form-item>
    <el-form-item label="商品描述">
      <el-input type="textarea" v-model="form.des"></el-input>
    </el-form-item>
    <el-form-item>
      <el-button type="primary" @click="onSubmit()">加入购物车</el-button>
      <el-button>取消</el-button>
    </el-form-item>
  </el-form>
</template>

<script>
  import jwtDecode from 'jwt-decode'
  export default {
    data() {
      return {
        form: {},
        cartdetail: {
          goodsId: 0,
          goods_name: '',
          image: '',
          number: 1,
          price: 0,
          user_id: 0
        },
        decode:{
          user:{}
        },

        user: {
        },

      }
    },
    methods: {
      findAll(id){
        this.$axios.get("/goods/selectOne?id=" + id  ).then(res=> {
          this.form = res.data;
        })
      },
      onSubmit() {
        var token = window.localStorage.getItem("userS");
        const decode = jwtDecode(token)
        this.user=JSON.parse(decode.user);
        this.cartdetail.goodsId = this.form.id;
        this.cartdetail.image = this.form.img;
        this.cartdetail.price = this.form.price;
        this.cartdetail.goods_name = this.form.goodsName;
        this.cartdetail.user_id = this.user.id ;
        this.$axios.post("/cartdetail/saveCart",this.cartdetail  ).then(res=>{
          this.$router.push({name:"carts",params:{id:1}});

        })
      }
    },
    mounted(){
      this.findAll(this.$route.params.id)
    }
  }
</script>

<style scoped>

</style>
